<style lang="less" scoped>
    @import './login.less';
    .ivu-card{
        border-radius: 10px;
        height:360px;
        background: #ced0cf;
    }
    .ivu-card-head{
        border: none;
        p{
            height: 90px;
        }
    }
    .ivu-card-body{
        padding: 0;
    }
    .ivu-input{
        font-size: 14px;
        line-height: 34px;
        height: 34px;
        padding: 6px 0;
        border-left-color: transparent;
    }
    .ivu-form-item-error-tip{
        left:20px;
    }
    .ivu-form-item-content{
        padding: 0 30px;
    }
    .signIn{
        margin: 0px;
        background: #36b2b2;
        border: none;
        font-size: 14px;
        line-height: 20px;
    }
    .ivu-input-group-append, .ivu-input-group-prepend{
        background: #fff;
        color: #36b2b2;
    }
    .ivu-input-group-prepend{
        padding: 2px 7px ;
    }
    .ivu-btn-primary:hover{
        background: #36b2b2;
    }
</style>

<template>
    <div class="login" @keydown.enter="handleSubmit">
        <div class="login_wrap">
            <div class="login-con">
                <p class="check_logol">
                    <img src="../images/logo_text.png" alt="">
                </p>
                <Card :bordered="false">
                    <p slot="title" class="check_img">
                        <img src="../images/ic_small.png" alt="">
                    </p>
                    <div class="form-con">
                        <Form ref="loginForm" :model="form" :rules="rules">
                            <FormItem prop="userName">
                                <Input v-model="form.userName" placeholder="请输入用户名">
                                <span slot="prepend">
                                        <Icon :size="25" type="person"></Icon>
                                    </span>
                                </Input>
                            </FormItem>
                            <FormItem prop="password">
                                <Input type="password" v-model="form.password" placeholder="请输入密码">
                                <span slot="prepend">
                                        <Icon :size="20" type="locked"></Icon>
                                    </span>
                                </Input>
                            </FormItem>
                            <p class="rememberMe">
                                <input type="checkbox" id="remember" checked="checked">
                                <label for="remember">记住账号</label>
                            </p>
                            <FormItem>
                                <Button @click="handleSubmit" type="primary" long class="signIn">登&nbsp;&nbsp;录</Button>
                            </FormItem>
                        </Form>
                    </div>
                </Card>
            </div>
        </div>

    </div>
</template>

<script>
export default {
    data () {
        return {
            form: {
                userName: '1101',
                password: 'zhinengche2017'
            },
            rules: {
                userName: [
                    { required: true, message: '账号不能为空', trigger: 'blur' }
                ],
                password: [
                    { required: true, message: '密码不能为空', trigger: 'blur' }
                ]
            }
        };
    },
    methods: {
        handleSubmit () {
        	var th = this;
            this.$refs.loginForm.validate((valid) => {
                if (valid) {
	                    this.$store.commit('setAvator', 'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3448484253,3685836170&fm=27&gp=0.jpg');
	                    //this.$store.commit('loginByUsername', this.form.userName, this.form.password);
	                    this.$store.dispatch('loginByUsername', th.form).then((res) => {
	                        console.log(this.form);
			                if(res.data.code == 1){
			                	this.$Message.success('登录成功');
			                	var storage=window.localStorage;
		                        storage.setItem("user",th.form.userName);
				                storage.setItem("password",th.form.password);
				                storage.setItem("parallelId",res.data.result.id);
	            				storage.setItem("parallelToken",res.data.result.accessToken);
				                
			                	//验证权限
			                	if (res.data.result.userType == 0) {
				                    storage.setItem("access",0);
				                } else {
				                    storage.setItem("access",1);
				                }
			                	this.$router.push({
				                    name: 'home_index'      
				                });
			                }else{
			                	this.$Message.error('帐号或密码错误');
			                }
				       }).catch(() => {
				            this.$Message.error('请联系后台管理人员');
				        })
				    
                    
                }
            });
        }
    }
};
</script>

<style>

</style>
